<template>  
  <div id="ArticleClassify">
    <AppCover :section="`classify${classify}`" :bgURL="coverURL" :bgPrURL="coverPrURL" />
    <ArticleList pageType="classify" />
  </div>
  <AppNav />
  <AppFooter />
</template>

<script>
import AppNav from '@/components/AppNav'
import AppCover from '@/components/AppCover'
import AppFooter from '@/components/AppFooter'
import ArticleList from '@/components/ArticleList'

export default {
  name: "ArticleClassify",
  components: { AppNav, AppCover, AppFooter, ArticleList },
  data(){
    return{
      coverURL: '',
      coverPrURL: '',
      classify: 0
    }
  },
  mounted(){
    this.setCoverBg()
  },
  watch: {
    '$route':'getPath'
  },
  methods:{   
    getPath(){
      this.setCoverBg()
    },
    setCoverBg(){
      this.classify = +this.$route.params.classify
      if(this.classify === 1){
        this.coverURL = '/files/img/section_cover/life.jpg'
        this.coverPrURL = '/files/img/section_cover/life_pr.jpg'
      }else{
        this.coverURL = '/files/img/section_cover/code.jpg'
        this.coverPrURL = '/files/img/section_cover/code_pr.jpg'
      }
    }
  }
}
</script>

<style lang="less" scoped>

</style>